$(function () {
    bindArea();
    binSeat();
    addPlaceInfo();
    SeatArray();
    CacleCorridor();
    choseSeat();
    SetCorridor();
    SetArea();
    placeImg();
    var id=$("#seatType").val();
    if(id!=""){
        updateInfoBind(id);
    }


})

/**
 * 绑定省市区
 */
function bindArea(){
    $.ajax({
        async:true,
        type:"GET",
        url:"/city/hasFatherId" ,
        data:{fatherId:0},
        dataType:"json",
        success:function(data){
            var options="<option value=''>--请选择--</option>"
            for(var i=0;i<data.length;i++){
                options+="<option value='"+data[i].cityId+"'>"+data[i].cityName+"</option>"
            }
            $("#province").html(options);
        },
        error:function (data) {
            alert("加载省失败");
        }
    });

    $("#province").change(function(){
        var province=$("#province").val();
        if(province!="" && province!=null){
            $.ajax({
                async:true,
                type:"GET",
                url:"/city/hasFatherId" ,
                data:{fatherId:province},
                dataType:"json",
                success:function(data){
                    $("#city").html("")
                    var options="<option value=''>--请选择--</option>"
                    for(var i=0;i<data.length;i++){
                        options+="<option value='"+data[i].cityId+"'>"+data[i].cityName+"</option>"
                    }
                    $("#city").html(options);
                },
                error:function (data) {
                    alert("加载市失败");
                }
            });
        }else{
            $("#city").html("");
            var options="<option value=''>--请选择--</option>";
            $("#city").html(options);
        }
        $("#area").html("");
        var options="<option value=''>--请选择--</option>";
        $("#area").html(options);
    })
    $("#city").change(function () {
        var city = $("#city").val();
        if(city!=''&&city!=null){
            $.ajax({
                type:"GET",
                url:"/city/hasFatherId" ,
                data:{fatherId:city},
                dataType:"json",
                success:function(data){
                    $("#area").html("")
                    var options="<option value=''>--请选择--</option>"
                    for(var i=0;i<data.length;i++){
                        options+="<option value='"+data[i].cityId+"'>"+data[i].cityName+"</option>"
                    }
                    $("#area").html(options);
                },
                error:function (data) {
                    alert("加载区失败");
                }
            });
        }else{
            $("#area").html("");
            var options="<option value=''>--请选择--</option>";
            $("#area").html(options);
        }
    });
}

/**
 * 提交表单信息
 */
function addPlaceInfo(){
    $("#addPlace").click(function () {
         var placeBaseInfo=$("#placeBaseInfo").serialize();
         $.ajax({
             type:"POST",
             url:"/place/addPlace",
             data:placeBaseInfo,
             dataType:"json",
             success:function (data) {
                 if(data>0){
                    placeId=data;
                    layer.msg("添加成功")
                     binSeat(placeId);
                 }else{
                     layer.msg("添加失败");
                 }
             },
             error:function (data) {
                 layer.msg("操作频繁")
             }
         })
         //alert(placeBaseInfo);
     })
}

var placeId;
function  binSeat(placeId) {
        var rows=$("#rownum").val();
        var cols=$("#columnnum").val();
        $.ajax({
            type:"GET",
            url:"/seat/findseatInfo",
            data:{placeId:placeId},
            dataType:"json",
            success:function (result) {
                $.each(result,function (i,e) {
                    $("#seat").append("<span style=\"display: inline-block;width: 45px;height: 45px;background-color: yellow\" class='seat' id='"+e.seatid+"'>"+e.rownum+"-"+e.columnnum+"</span>");
                    if(e.place.columnnum==e.columnnum){
                        $("#seat").append("<br/>");
                    }
                })
            }
        })
}

/**
 * 选择座位进行座位走廊和区数的筛选
 */
function choseSeat(){
    $("#seat").on("click",".seat",function () {
        if($(this).css('background-color')!="rgb(0, 255, 0)"){
            if($(this).css('background-color')=="rgb(255, 0, 0)"){
                $(this).css('background-color', 'yellow');
            }else{
                $(this).css('background-color', 'red');
            }
        }

    })
}

/**
 * 封装方法，存放座位信息
 * @type {any[]}
 */
var array=new Array(); //定义数组存放已选中的座位信息
function SeatArray(){
    array=[];
    $("#seat .seat").each(function (i,e) {
        if($(e).css('background-color')=="rgb(255, 0, 0)"){
            array[array.length]=$(e).attr("id");
        }
    })
}

/**
 * 设置所选区的颜色
 */
function changeSeatColor(color){
    $("#seat .seat").each(function (i,e){
        if($(e).css('background-color')=="rgb(255, 0, 0)"){
           $(e).css("background-color",color);
        }
    })
}
/**
 * 设置走廊的方法
 * @constructor
 */
function SetCorridor(){
    $("#SetCorridor").click(function () {
        SeatArray();
        //alert(array.length);
        $.ajax({
            async : false,
            cache : false,
            traditional: true,
            type:"POST",
            url:"/seat/upSeatInfo",
            data:{array:array,iscorridor:0},
            dataType:"JSON",
            success:function (data) {
               if(data){
                   $("#seat .seat").each(function (i,e) {
                       if($(e).css('background-color')=="rgb(255, 0, 0)"){
                           $(e).css("background-color","rgb(0, 255, 0)")
                       }
                   })
                   layer.msg("操作成功");
                   SeatArray();
               }else{
                   layer.msg("操作失败");
               }
            },
            error:function () {
                layer.msg("操作频繁");
            }
        })
    })
}

/**
 * 取消走廊的方法
 * @constructor
 */
function CacleCorridor(){
    $("#seat").on("dblclick",".seat",function () {
        var seat=$(this);
        if($(this).css('background-color')=="rgb(0, 255, 0)"){
            var seatArray=new Array();
            seatArray[seatArray.length]=$(this).attr("id");
            $("#CacleCorridor").click(function () {
                $.ajax({
                    async : false,
                    cache : false,
                    traditional: true,
                    type:"POST",
                    url:"/seat/upSeatInfo",
                    data:{array:seatArray,iscorridor:1},
                    dataType:"JSON",
                    success:function (data) {
                        if(data){
                            seat.css('background-color',"yellow");
                            layer.msg("操作成功");
                        }else{
                            layer.msg("操作失败");
                        }
                    },error:function () {
                        layer.msg("操作频繁")
                    }
                })
            })
        }
    })
}

/**
 * 设置区数
 * @constructor
 */
function SetArea() {
    $("#addArem").click(function () {
        SeatArray();
        var ticketfilename=$("#ticketfilename").val();
        var areanum=$("#areanum").val();
        var color=$("#hue-demo").val();
        if(ticketfilename.length>0&&areanum.length>0){
            $.ajax({
                async : false,
                cache : false,
                traditional: true,
                type:"GET",
                url:"/ticket/addTicketFileInfo",
                data:{ticketfilename:ticketfilename,areanum:areanum,array:array,placeId:placeId,color:color},
                dataType:"JSON",
                success:function (data) {
                    if(data){
                        changeSeatColor(color);
                        layer.closeAll();
                        layer.msg("操作成功");
                    }else{
                        layer.msg("操作失败");
                    }
                },
                error:function (data) {
                    layer.msg("操作频繁");
                }
            })
        }else{
            layer.msg("该项为必填字段，不能为空")
        }
    })
}

function placeImg() {
    //图片上传预览功能
    var userAgent = navigator.userAgent; //用于判断浏览器类型
    //使用formData完成多图片上传
    var formData = new FormData();
    var formData2 = new FormData();

    $(".file").change(function() {
        //获取选择图片的对象
        var docObj = $(this)[0];
        var picDiv = $(this).parents(".picDiv");
        //得到所有的图片文件
        var fileList = docObj.files;
        //将图片数据放到formData中传递后台
        if($(this)[0].files.length==1){
            formData.append("file",docObj.files[0]);
            formData2.append("file",docObj.files[0]);
        }else{
            for(var i=0; i<$(this)[0].files.length;i++){
                formData.append("file",$(this)[0].files[i]);
                formData2.append("file",$(this)[0].files[i]);
            }
        }
        //循环遍历
        for (var i = 0; i < fileList.length; i++) {
            //动态添加html元素
            var picHtml = "<div class='imageDiv' nm='"+fileList[i].name+"'> <img id='img" + fileList[i].name + "' /> <div class='cover'><i class='delbtn'>删除</i></div></div>";
            console.log(picHtml);
            picDiv.prepend(picHtml);
            //获取图片imgi的对象
            var imgObjPreview = document.getElementById("img" + fileList[i].name);
            if (fileList && fileList[i]) {
                //图片属性
                imgObjPreview.style.display = 'block';
                imgObjPreview.style.width = '150px';
                imgObjPreview.style.height = '120px';
                //imgObjPreview.src = docObj.files[0].getAsDataURL();
                //火狐7以上版本不能用上面的getAsDataURL()方式获取，需要以下方式
                if (userAgent.indexOf('MSIE') == -1) {
                    //IE以外浏览器
                    imgObjPreview.src = window.URL.createObjectURL(docObj.files[i]); //获取上传图片文件的物理路径;
                    console.log(imgObjPreview.src);
                    // var msgHtml = '<input type="file" id="fileInput" multiple/>';
                } else {
                    //IE浏览器
                    if (docObj.value.indexOf(",") != -1) {
                        var srcArr = docObj.value.split(",");
                        imgObjPreview.src = srcArr[i];
                    } else {
                        imgObjPreview.src = docObj.value;
                    }
                }
            }
        }
        /*删除功能*/
        $(".delbtn").click(function() {
            if(formData.getAll("file").length==0){
                formData=formData2;
            }else{
                formData2.delete("file");
                for(var i=0;i<formData.getAll("file").length;i++){
                    if(formData.getAll("file")[i].name==$(this).parents(".imageDiv").attr("nm")){

                    }else{
                        formData2.append("file",formData.getAll("file")[i]);
                    }
                }
            }
            formData.delete("file");
            for(var i=0;i<formData2.getAll("file").length;i++){
                formData.append("file",formData2.getAll("file")[i]);
            }
            var _this = $(this);
            _this.parents(".imageDiv").remove();
        });
    });
    $("#bbt").click(function(){
        formData2.append("placeId",placeId);
        $.ajax({
            async : false,
            traditional: true,
            type:'post',
            dataType:'json',
            data:formData2,
            cache: false, //上传文件不需要缓存
            url:'/place/MultPictareaddData',
            processData: false, // 告诉jQuery不要去处理发送的数据
            contentType: false, // 告诉jQuery不要去设置Content-Type请求头
            success:function(data){
                if(data=="true"){
                    layer.msg("上传成功");
                    // window.location.reload();
                }else if(data=="false"){
                    layer.msg("上传失败");
                }else{
                    layer.msg("操作频繁,请稍后再试");
                }
            },
            error:function (data) {
                layer.msg("网络延迟")
            }
        })
    })
}


/**
 * 绑定场地的基本信息
 * @param id
 */
function updateInfoBind(id) {
    $("#find").addClass("display","none");
    $.ajax({
        type:"GET",
        url:"/place/findByPlaceIdPlaceInfo",
        data:{placeId:id},
        dataType:"JSON",
        success:function (data) {
            $("#placename").val(data.placename);
            $("#province option[value='"+data.cityoneId+"']").prop("selected",true);
            $("#city").val(data.citytwoId);
            $("#area").val(data.citythreeId);
            $("#address").val(data.address);
            $("#rownum").val(data.rownum);
            $("#columnnum").val(data.columnnum);
        }
    })

    $.ajax({
        type:"GET",
        url:"/place/findPlaceImg" ,
        data:{placeId:id},
        dataType:"json",
        success:function(data){
            $.each(data,function(i,e){
                $(".addImages").before("<div class='imageDiv'><img src='/Path/"+e+"'><div class='cover'><i class='delbtn'>删除</i></div></div>")
            })
        },
        error:function (data) {
            layer.msg("网络连接超时");
        }
    });

    /**
     * 这个场地的所有票档信息
     * @type {Array}
     */
    var tickets=null;

    /**
     * 根据场地id查询票档信息
     */
    $.ajax({
        type:"GET",
        url:"/ticket/selectAllByPlaceid",
        data:{placeid:id},
        dataType:"json",
        success:function (data) {
           tickets=data;
            $("#seatcolor").append("<li style='display: inline-block;text-align: center;margin-right: 8px'><p style='margin: 0px'>走廊</p><span style='background-color: rgb(0, 255, 0) ;width: 30px;height: 30px;display: inline-block'></span></li>")
           $.each(data,function (i,e) {
               $("#seatcolor").append("<li style='display: inline-block;text-align: center;margin-right: 8px'><p style='margin: 0px'>"+e.areanum+"/"+(e.ticketfilename)+"</p><span style='background-color: "+e.color+" ;width: 30px;height: 30px;display: inline-block'></span></li>")
           })

        }
    })

    /**
     * 绑定座位信息
     * @type {*|jQuery|*|*|*}
     */
        var rows=$("#rownum").val();
        var cols=$("#columnnum").val();
        $.ajax({
            type:"GET",
            url:"/seat/findseatInfo",
            data:{placeId:id},
            dataType:"json",
            success:function (result) {
                $.each(result,function (i,e) {
                    for(var i=0;i<tickets.length;i++){
                        if(tickets[i].areanum==e.areanum){
                            $("#seat").append("<span style=\"display: inline-block;width: 45px;height: 45px;background-color: "+tickets[i].color+"\" class='seat' id='"+e.seatid+"'>"+e.rownum+"-"+e.columnnum+"</span>");
                        }
                    }
                    if (e.areanum == null) {
                        $("#seat").append("<span style=\"display: inline-block;width: 45px;height: 45px;background-color:rgb(0, 255, 0) \" class='seat' id='" + e.seatid + "'>" + e.rownum + "-" + e.columnnum + "</span>");
                    }
                    if(e.place.columnnum==e.columnnum){
                        $("#seat").append("<br/>");
                    }
                })
            }
        })


}

